<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:c="http://java.sun.com/jsp/jstl/core"
                xmlns:p="http://xmlns.jcp.org/jsf/passthrough" xmlns:f="http://xmlns.jcp.org/jsf/core">
    <h:form styleClass="blog-comment-list" id="blog-comment-list">
        <h4 class="well">评论列表
            <small>(+#{articleBean.post.commentCount} 条评论)</small>
        </h4>
        <ol>
            <c:forEach items="#{articleBean.comments.item}" var="comment">
                <li class="well blog-post-comment-item">
                    <div class="blog-post-comment-item-cotent">
                        <h:outputText escape="false" value="${comment.content}"/>
                    </div>
                    <div class="blog-post-meta blog-post-comment-item-meta small">
                        ${comment.author.username}发表于${comment.publishDate}
                    </div>
                    <img class="blog-post-comment-item-gravatar img-circle" width="44" height="44"
                         src="http://gravatar.duoshuo.com/avatar/#{userBean.getHashByEmail(comment.author.email)}?s=44&amp;d=mm&amp;r=g"/>
                </li>
            </c:forEach>
        </ol>
        <ul class="pager">
            <c:choose>
                <c:when test="#{articleBean.comments.pageIndex gt 1}">
                    <li>
                        <h:commandLink value="上一页" outcome="article">
                            <f:param name="id" value="#{articleBean.post.id}"/>
                            <f:param name="c-page" value="#{articleBean.comments.pageIndex-1}"/>
                            <f:ajax render="blog-comment-list"/>
                        </h:commandLink>
                    </li>
                </c:when>
                <c:otherwise>
                    <li><span>上一页</span></li>
                </c:otherwise>
            </c:choose>
            #{articleBean.comments.pageIndex} / #{articleBean.comments.pageTotal}
            <c:choose>
                <c:when test="#{articleBean.comments.pageIndex lt articleBean.comments.pageTotal}">
                    <li>
                        <h:commandLink value="下一页" outcome="article">
                            <f:param name="id" value="#{articleBean.post.id}"/>
                            <f:param name="c-page" value="#{articleBean.comments.pageIndex+1}"/>
                            <f:ajax render="blog-comment-list"/>
                        </h:commandLink>
                    </li>
                </c:when>
                <c:otherwise>
                    <li><span>下一页</span></li>
                </c:otherwise>
            </c:choose>
        </ul>
    </h:form>
    <div class="well">
        <c:choose>
            <c:when test="#{userBean.currentUser == null}">
                <h4>发表评论</h4>
                <h:form>
                    <!--
                     这里的执行顺序是，点击link后，post给本页面article.xhtml该页面需要articleBean进入其构造器
                     他的构造器结束后渲染article.xhtml（只是渲染 还不会响应给浏览器）（因此post不能为null，否则不会进入下面这行
                     直接在singer.xhtml里就跳到otherwise了）渲染到下面一行后再执行article的tologin方法
                     -->
                    <input type="hidden" name="returnUrl" value="${request.requestURI}?${request.queryString}"/>
                    您必须<h:commandLink action="#{articleBean.toLogin}" value="登录"/>才能发表评论。没有账号？
                    <h:commandLink action="#{articleBean.toRegister}" value="注册"/>
                </h:form>
            </c:when>
            <c:otherwise>
                <c:choose>
                    <c:when test="#{articleBean.post.allowComment}">
                        <h:form styleClass="form" role="form"
                                p:action="${request.requestURI}?id=${articleBean.post.id}">
                            <div class="form-group">
                                <h:outputLabel for="comment-content-area">添加评论</h:outputLabel>
                                <small>您正以 ${userBean.currentUser.username} 的身份登录，若要换另一个账号，请先
                                    <h:commandLink action="#{userBean.logout}" value="退出"/></small>
                                <h:inputTextarea id="comment-content-area" styleClass="form-control"
                                                 value="#{commentBean.content}"/>
                            </div>
                            <input type="hidden" name="id" value="${articleBean.post.id}"/>
                            <input type="hidden" name="returnUrl" value="${request.requestURI}?${request.queryString}"/>
                            <h:commandButton styleClass="btn btn-primary" action="#{commentBean.comment}" value="发表评论"/>
                        </h:form>
                    </c:when>
                    <c:otherwise>
                        <div class="help-block">评论已关闭</div>
                    </c:otherwise>
                </c:choose>

            </c:otherwise>
        </c:choose>
    </div>
</ui:composition>